<template>
    <div class="dbtn-content-box">
        <div class="attr-item dbtn-text" style="margin-top: 10px;">
            <div class="attr-item-label">文本</div>
            <div class="block">
                <el-input v-model="content.value" size="mini" placeholder="下载按钮文字"/>
            </div>
        </div>
        <div class="attr-item">
            <div class="attr-item-label">安卓下载链接</div>
            <div class="block">
                <el-input v-model="content.android_download_url" size="mini"
                          placeholder="示例：http://ad.yixia.com/xxx.apk"/>
            </div>
        </div>
        <div class="attr-item">
            <div class="attr-item-label">IOS下载链接</div>
            <div class="block">
                <el-input v-model="content.ios_download_url" size="mini" placeholder="示例：http://ad.yixia.com/xxx.ipa"/>
            </div>
        </div>
        <div class="attr-item">
            <div class="attr-item-label">安卓唤起链接</div>
            <div class="block">
                <el-input v-model="content.android_evoke_url" size="mini" placeholder="示例：bobo://bb.web"/>
            </div>
        </div>
        <div class="attr-item">
            <div class="attr-item-label">IOS唤起链接</div>
            <div class="block">
                <el-input v-model="content.ios_evoke_url" size="mini" placeholder="示例：bobo://home?home"/>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'BtnContent',
        props: {
            content: {
                type: Object,
                default: _ => {
                    return {
                        value: '立即下载',
                        android_download_url: '',
                        android_evoke_url: '',
                        ios_download_url: '',
                        ios_evoke_url: ''
                    };
                }
            }
        }
    }
</script>

<style scoped lang="scss">
    .dbtn-content-box {
        .attr-item {
            height: 56px;
            overflow: hidden;
            margin-top: 5px;

            .attr-item-label {
                padding-right: 12px;
                line-height: 28px;
            }
        }
        .dbtn-text {
            .attr-item-label {
                padding-right: 29px;
            }
        }
    }
</style>
